#main-nav class="#{layout_class}"

  / Uncomment to enable the global message
  / IMPORTANT NOTE: When the global message is enabled, add an additional 90px of
  / top padding to #content-outer (for the small breakpoint) in layout.scss or
  / the hero title gets covered by the navigation on mobile devices
  = partial "layouts/message"

  .main-nav--container.clearfix
    .main-nav--logo
      a href="/"
        h1 habitat
    nav.main-nav--links-wrap
      .main-nav--toggle
        = partial "layouts/nav-toggle-icon.svg"
      .main-nav--cta
        a.button href="/try" Try the Demo
      ul.main-nav--links
        li.main-nav--link
          = link_to 'Why Habitat', '/about/index.html', class: 'about'
        li.main-nav--link
          = link_to 'Search Packages', 'https://app.habitat.sh'
        li.main-nav--link
          a.docs href="/docs" Docs
        li.main-nav--link
          a.tutorials href="/tutorials" Tutorials
        li.main-nav--link
          a.community href="/community" Community
